<template>
  <div class="page">
    <h1>Hello</h1>

    <!-- <MenuCheck v-model="roleIds" /> -->

    <!-- <el-form>
      <el-form-item label="角色">
        <RoleSelect v-model="roles" />
      </el-form-item>
    </el-form> -->

    <!-- <el-form>
      <el-form-item label="角色">
        <AvatarUpload v-model="headImg" />
      </el-form-item>
    </el-form> -->

    <el-form>
      <el-form-item label="图标">
        <IconSelect v-model="icon" />
      </el-form-item>
    </el-form>
  </div>
</template>

<script>
import MenuCheck from "@/components/menu-check/index.vue";
import RoleSelect from "@/components/role-select/index.vue";
import AvatarUpload from "@/components/avatar-upload/index.vue";
import IconSelect from "@/components/icon-select/index.vue";

export default {
  name: "Hello",

  components: {
    MenuCheck,
    RoleSelect,
    AvatarUpload,
    IconSelect,
  },

  data() {
    return {
      icon: "CaretTop",
      roleIds: [1, 2, 4],
      roles: [2],
      headImg:
        "http://127.0.0.1:8001/public/uploads/20231109/a93c5ea0-7ecf-11ee-83c5-2942028124f2.jpg",
    };
  },
};
</script>
